<template>
  <el-dialog title="修改积分" :visible.sync="visible" width="30%" :before-close="handleClose" :close-on-click-modal="false" :inline="true">
    <el-form label-position="left" label-width="80px" :model="attach">
      <el-form-item label="积分" size="small">
        <el-input-number v-model="value" :min="0" :max="999999999" />
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" size="small" @click="saveCredit">保存</el-button>
      <el-button size="small" @click="handleClose">取消</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  props: {
    userId: {
      type: Number,
      required: true
    },
    visible: {
      type: Boolean,
      default: false
    },
    credit: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      value: ''
    };
  },
  watch: {
    credit: {
      handler(val) {
        this.value = val;
      }
    }
  },
  methods: {
    handleClose() {
      this.$emit('update:visible', false);
    },
    saveCredit() {
      this.$http.put('/user/admin/credit/' + this.userId + '/set', { credit: this.value }, () => {
        this.$emit('update:credit', this.value);
        this.handleClose();
      }, error => {
        this.$message.error(error.msg)
      }, false);
    }
  }
};
</script>
